<template>
	<!-- 状态栏 适应手机 -->
	<u-sticky class="app-header">
		<view :class="classKey">
			<u-navbar :autoBack="autoBack" :bgColor="bgColor" :placeholder="placeholder" :title="title" :titleStyle="{color: titleStyle}">
				<template #left>
					<slot name="left">
						<view class="navbar-left" v-if="autoBack">
							<u-icon :color="iconColor" name="arrow-left"></u-icon>
						</view>
						<view v-else class=""></view>
					</slot>
				</template>
			</u-navbar>
		</view>
	</u-sticky>

</template>

<script>
	export default {
		props: {
			title: String,
			autoBack: {
				type: Boolean,
				default: () => {return false}
			},
			placeholder: {
				type: Boolean,
				default: () => {return true}
			},
			titleStyle: {
				type: String,
				default: '#fff'
			},
			classKey: {
				type: String,
				default: 'app-navbar'
			},
			bgColor: {
				type: String,
				default: 'transparent'
			},
			iconColor: {
				type: String,
				default: '#fff'
			}
		},
		data() {
			return {
				type: "error",
				value: 8,
			};
		}
	}
</script>

<style lang="scss" scoped>
	.navbar-left{
		.left-txt{
			font-size: 30rpx;
			color: #333;
			margin-left: 20rpx;
		}
	}
</style>
